<template>
  <div class="wrapper">
    <index-header></index-header>
    <div>
      <task-search class="taskSearch" ref="taskSearch"></task-search>
      <nut-button block shape="circle" @click="GetSearchTime">查询</nut-button>
    </div>
    <router-view></router-view>
    <footer class="footer">
      <nav class="nav">
        <button :class="{navActive:navActive==0}" class="index navBtn" @click="ShowIndex(0)">首页</button>
        <button :class="{navActive:navActive==1}" class="history navBtn" @click="ShowHistory(1)">历史</button>
      </nav>
    </footer>
  </div>
</template>

<script>
import IndexHeader from "./IndexHeader";
import TaskSearch from "./TaskSearch";
export default {
  name: "Index",
  // computed:Vuex.mapState(['userName'])
  components: {
    IndexHeader,
    TaskSearch
  },
  data() {
    return {
      startDate: "",
      endDate: "",
      data: [],
      navActive: 0
    };
  },
  methods: {
    getTaskList() {
      this.$axios({
        url: "/api/Task/GetTaskList",
        params: {
          startDate: this.startDate,
          endDate: this.endDate,
          workCode: this.$store.state.userInfo.workCode
        },
        method: "get"
      }).then(res => {
        var obj = JSON.parse(res.data);
        if (obj.ret) {
          this.$store.dispatch("saveTaskList", obj.data);
        } else {
          this.$store.dispatch("saveTaskList", "");
          this.$toast.fail(obj.res);
        }
      });
    },
    GetPatientList(startDate, endDate, TaskCode) {
      this.$axios({
        url: "/api/Patient/GetPatientList",
        params: {
          startDate: startDate,
          endDate: endDate,
          workCode: this.$store.state.userInfo.workCode,
          TaskCode: TaskCode
        },
        method: "get"
      }).then(res => {
        var obj = JSON.parse(res.data);
        //console.log(obj);
        if (obj.ret) {
          this.$store.dispatch("savePatientList", obj.data);
        } else {
          this.$store.dispatch("savePatientList", "");
          this.$toast.fail(obj.res);
        }
      });
    },
    GetSearchTime() {
      this.startDate = this.$refs.taskSearch.startDate;
      this.endDate = this.$refs.taskSearch.endDate;
      if (this.navActive == 0) {
        this.getTaskList();
      } else {
        this.GetPatientList(this.startDate, this.endDate, "");
      }
    },
    ShowIndex(index) {
      this.navActive = index;
      this.$router.push({ name: "TaskList" });
    },
    ShowHistory(index) {
      this.navActive = index;
      this.GetPatientList("", "", "");
      this.$router.push({ name: "PatientList" });
    },
    openPatientWin(TaskCode) {
      this.navActive = 1;
      this.GetPatientList("", "", TaskCode);
      this.$router.push({ name: "PatientList" });
    }
  },
  mounted() {
    this.getTaskList();
    this.GetPatientList("", "", "");
    this.ShowIndex(0);
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="less" scoped>
.taskSearch {
  padding: 5px 0;
}
.footer {
  position: fixed;
  z-index: 103;
  bottom: 0;
  background: #fff;
  width: 100%;
}
.nav {
  width: 100%;
  display: flex;
  // height: 0.8rem;
  // justify-content: space-around;
  align-items: center;
}
.navBtn {
  width: 49%;
  padding: 0.1rem 0;
  border-radius: 0.1rem;

  border: 1px solid rgba(200, 60, 60, 0.8);
  color: #000;
  background: #fff;
}
.index {
  margin-right: 2%;
}
.navActive {
  background: rgba(200, 60, 60, 0.8);
  color: #fff;
}
</style>
